const _drag = (dom) => {
	var _doc = document;
	var _dom = dom;
	var _id = dom.id;
	if (!_id) {
		_dom.id = new Date() + "_autoid";
		_id = _dom.id;
	}

	var _p = {
		x: 0,
		y: 0
	};

	var _isTag = false;
	const hMouseDown = (e) => {
		if (!e.path)
			return;
		let dom = e.path[0] == _dom; // e.path.find(t => t == _dom);
		if (!dom) {
			hMouseUp();
			return;
		}
		_isTag = true;
		_doc.addEventListener("mousemove", hMove);
		_doc.addEventListener("mouseup", hMouseUp);
	}

	const hMouseUp = (e) => {
		_isTag = false;
		_doc.removeEventListener("mouseup", hMouseUp);
		_doc.removeEventListener("mousemove", hMove);
	}
	var _gop = {};
	const hGlobalMove = (e) => {
		_gop.x = e.clientX;
		_gop.y = e.clientX;
	}
	_doc.removeEventListener("mousemove", hGlobalMove);

	const hMove = (e) => {
		if (!_isTag)
			return;
		_p.x += e.movementX;
		_p.y += e.movementY;
		_dom.style.transform = `translate(${_p.x}px,${_p.y}px)`;
	}
	const hPos = (e) => {
		let x = 0;
		let y = 0;
		if (!e) {
			x = _gop.x;
			y = _gop.y;
		}
		_p.x = 0;
		_p.y = 0;
		_dom.style.top = `${y}px`;
		_dom.style.left = `${x}px`;
		_dom.style.transform = '';
	};
	_doc.addEventListener("mousedown", hMouseDown, false);
	return {
		hPos
	}
};
export default _drag;
